<template>
  <div style="padding:10px;height:100%; ">
    <el-form :inline="true">

      <el-form-item>
        <el-button
          type="primary"
          @click="resetPassword"
          icon="delete"
        >重置密码</el-button>

      </el-form-item>
       <el-form-item >
        <el-input v-model="search_str"  @change="clear" @input="mysearch" placeholder="请输入姓名搜索" clearable></el-input>
      </el-form-item>

    </el-form>
    <el-table
      style="width:100%"
      :data="list.slice((currentPage-1)*pageSize,currentPage*pageSize)"
      height="500px"
      v-loading="listLoading"
      element-loading-text="Loading"
      ref="table"
      @selection-change="changeFun"
      border
    >
      <el-table-column
        type="selection"
        width="55"
        align="center"
        class="selection"
        prop='uuid'
      ></el-table-column>
      <el-table-column
        align="center"
        type="index"
        width="50"
        label="序号"
        fixed="left"
      >
        <template slot-scope="scope">
          <span>{{(currentPage- 1) * pageSize + scope.$index + 1}}</span>
        </template>
      </el-table-column>

      <DataListItem
        v-bind:key="$index"
        v-for="(item,$index) in cols"
        :column="item"
      />


    </el-table>
    <el-pagination
      align="right"
      style="margin-top:20px"
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="currentPage"
      :page-sizes="[20, 50, 100, 150, 200]"
      :page-size="pageSize"
      background
      layout="total, sizes, prev, pager, next, jumper"
      :total="list.length"
    >
    </el-pagination>
   
  </div>
</template>
<script>
import Vue from "vue";
import request from "@/utils/request";
import { getUser } from "@/utils/auth";
import linq from "linq";
import axios from "axios";
import {search教师基本情况,get教师基本情况ByGH} from "@/api/教师基本情况"
import { add权限, delete权限, update权限, get权限 } from "@/api/权限.js";
import { uuid } from "vue-uuid";
export default {
  
  components: {
    
    
    DataListItem: {
      name: "DataListItem",
      template: `<el-table-column :label='column.label' :prop='column.prop' align="center">
          
          <DataListItem :key="$index" v-for="(item,$index) in column.data?column.data:[]" :column="item" />
          </el-table-column>
          `,
      props: ["column"]
    }
  },
  data: function() {
    return {
      model: {},
     search_str:'',
      cols: [
        { label: "部门", prop: "BMMC" },
        { label: "工号", prop: "GH" },
        { label: "姓名", prop: "XM" },
        ],
      listLoading: true,
      list: [],
      
      multipleSelectionDelete: [],
      multipleSelection: [],
      currentPage: 1,
      pageSize: 20,
      user: null
    };
  },

  async created() {
    //

    this.listLoading = true;
    let datas = await get权限(this.$root.user.XXID,this.$root.user.CJPC);
    
    this.raw = datas;
    this.list = JSON.parse(JSON.stringify(datas));
    this.listLoading = false;
    //
  },

  methods: {
    changeFun(val) {
      this.multipleSelection = val;
    },

    handleSizeChange: function(size) {
      this.pageSize = size;
    },
    handleCurrentChange: function(currentPage) {
      this.currentPage = currentPage;
    },
   
    resetPassword() {
      this.$confirm("你确定是否重置所选密码").then(async e => {
        try {
          this.listLoading = true;
          await Promise.all(
            this.multipleSelection.map(async (item, index) => {
             item.PASSWORD = "1"
              await update权限(item);
            })
          );
          this.$alert("重置密码成功");
        } catch (e) {
          this.$alert(e);
        }finally{
           this.listLoading = false;
        }
      });
    }
  }
};
</script>